<template>
  <div class="page-common-layout">
    <div class="page-common-left" style="width:500px">
      <TableClassify title="门户授权"
                     :treeData="classifyData"
                     @select="masterRowClick"
                     :replaceFields="{title:'roleName', key:'id' }"
                     :loading="masterConfirmLoading"
                     searchPlaceholder="名称"
                     searchFieldName="roleName"
      ></TableClassify>
    </div>
    <div class="page-common-content">
      <tool-bar
        @search="$refs.subList.refresh(true)"
        @reset="
          () => {
            ((subQueryParam.userName = ''), delete subQueryParam.userName),
            $refs.subList.refresh(true);
          }
        "
      >
        <template slot="toolBtn" slot-scope="scope">
          <a-button
            class="cu-btn-primary"
            icon="plus"
            @click="handleSelect()"
            >{{$ct("batchLicensing","批量授权")}}</a-button
          >
        </template>
        <template slot="toolForm">
          <a-form-item :label="$ct('fullName','姓名')">
            <a-input v-model="subQueryParam.userName" :placeholder="$ct('fullName','姓名')" />
          </a-form-item>
        </template>
      </tool-bar>
      <dataGrid
        ref="subList"
        type="sub"
        :url="url"
        :columns="subColumns"
        :queryParam="subQueryParam"
        rowKey="uuid"
      >
      </dataGrid>
      <edit-form
        ref="masterModal"
				:key="Date.now().valueOf()"
        :visible="masterVisible"
        :loading="masterConfirmLoading"
        :model="masterMdl"
        @cancel="handleCancel()"
        @ok="handleOk"
      />
    </div>
  </div>
</template>
<script>
import { getFilter } from "@/utils/TopVUI";
import { TreeGrid, DataGrid, TableClassify } from "@/components";
import { treeGridMixin } from "@/mixins/treeGridMixin";
import editForm from "./edit.vue";

export default {
  mixins: [treeGridMixin],
  components: {
    TreeGrid,
    editForm,
    DataGrid,
    TableClassify
  },
  data() {
    return {
      columns: [
        {
          title: "角色名称",
          align: "left",
          dataIndex: "text",
					langCode: "roleName"
        }
      ],
      subColumns: [{
				title: "员工号",
				align: "center",
				dataIndex: "userNameId",
				langCode: "employeeNo",
				sorter: true,
			},
			{
				title: "姓名",
				dataIndex: "userName",
				langCode: "fullName"
			}],
      masterVisible: false,
      subVisible: false,
      masterConfirmLoading: false,
      subConfirmLoading: false,
      masterMdl: null,
      subMdl: null,
      // 高级搜索 展开/关闭
      advanced: false,
      // 查询参数
      queryParam: {},
      subQueryParam: {},
      url: {
        fathersUrl: "/system/authGroup/getListByUserUuid",
        expandUrl: "/system/exampleSingleTreegrid/getListByPid",
        masterUpdate: "/system/exampleSingleTreegrid/update",
        masterDelete: "/system/exampleSingleTreegrid/deleteBatch",
        masterSaveRoot: "/system/exampleSingleTreegrid/save",
        masterSave: "/system/exampleSingleTreegrid/save",
        subList: "/mdata/user/getPageSetUserByRoleId",
        subSave: "/system/exampleRightDatagrid/save",
        subUpdate: "/system/exampleRightDatagrid/update",
        subDelete: "/system/exampleRightDatagrid/deleteBatch",
      },
			masterRows: {},
			tLoading: false,
      classifyData: [],
      masterConfirmLoading: false,
    };
  },
  activated() {},
  mounted() {
    this.getClassifyData();
  },
  filters: {
    testComboboxFilter(val) {
      if (val === "true") {
        return "可排序";
      } else if (val === "false") {
        return "不可排序";
      }
    },
  },
  methods: {
		// 行点击
		masterRowClick(e){
      this.subQueryParam['id'] = e[0]
      this.$refs.subList.rows = null
      this.$refs.subList.refresh()
    },
    getClassifyData(){
      this.masterConfirmLoading = true
      this.$post("/system/sysRole/getListSysRole", {}).then(res => {
        if(res.statusCode === 200){
          this.classifyData = res.data
          this.masterConfirmLoading = false
        }
      })
    },
		masterRowClassName(row) {
			return row.uuid === this.masterRows?.uuid ? 'bg-bray' : '' // 每条数据的唯一识别值
		},
		handleSelect(){
			let userRows = this.$refs.subList.selectedRows
			if(userRows.length){
				this.masterVisible = true
			}else{
				this.$message.warn('请勾选要授权的用户', 1.5)
			}
		},
		handleOk(uuid, code){
			let userInfo = this.$refs.subList.selectedRows.map(e => {return e.userNameId})
			this.$post("/system/sysPortal/updateSysPortalByRoleId",{
				uuid: uuid,
				userNameId: userInfo.toString(),
				templateClassiftCode: code
			}).then(res => {
				this.masterVisible = false
				if(res.statusCode == 200){
					this.$message.success(res.message, 1.5)
				}else{
					this.$message.warn(res.message, 1.5)
				}
			})
		},
		handleCancel(){
			this.masterVisible = false
		}

	},
};
</script>

<style scope>
.table-operator {
  margin-left: 18px;
}

.ant-table-tbody > tr > td:last-child {
  padding: 16px 16px;
}
</style>
